<template>
	<view class="pages">
		<view class="card">
			<view class="card_titlte">{{data.title}}</view>
			<view class="card_titlte_sm">本次巡检共有{{tol}}项，当前{{curr+1}}/{{tol}}项</view>
			<view class="ab"><text>{{data.content}}</text></view>
			<view class="row">
				<text class="nowrap">巡检结果</text>
				<picker @change="XJresultChange" :value="XJresultIndex" :range="XJresult" range-key="name">
						<view class="uni-input">{{XJresult[XJresultIndex].name}}</view>
					</picker>
			</view>
			<view class="row" v-if="XJresultIndex!=0||data.is_photo==1">
				<text class="nowrap">巡检情况</text>
				<view style="width:100%;" class="textarea">
					<textarea :value="content" placeholder="文字描述" />
				</view>
			</view>
			<view class="row" v-if="XJresultIndex!=0||data.is_photo==1">
				<text class="nowrap">现场视图</text>
				<view class="pre_pic">
					<image v-for="(item,index) in picsarr" :key='index' :src="item" mode=""></image>
					<image src="../../static/fengxianxuncha.1/jia.png" @click="updatafile" mode=""></image>
				</view>
			</view>
			<view class="row" v-if="XJresultIndex!=0||data.is_photo==1">
				<text class="nowrap">隐患大类</text>
				<picker @change="YHDLChange" :value="YHDLIndex" :range="YHDL" range-key="name">
						<view class="uni-input">{{YHDL[YHDLIndex].name}}</view>
					</picker>
			</view>
			<view class="row" v-if="XJresultIndex!=0||data.is_photo==1">
				<text class="nowrap">隐患小类</text>
				<picker @change="YHXLChange" :value="YHXLIndex" :range="YHXL" range-key="name">
						<view class="uni-input">{{YHXL[YHXLIndex].name}}</view>
					</picker>
			</view>
			<view class="row" v-if="XJresultIndex!=0||data.is_photo==1">
				<text class="nowrap">整改期限</text>
					<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
						<view class="uni-input">{{date}}</view>
					</picker>
			</view>
			<!-- <view class="row" v-if="XJresultIndex!=0">
				<text class="nowrap">整改人</text>
				<input type="text" placeholder="整改人" class="zgr">
			</view> -->
			<view class="">
				<button type="primary" class="btntj" @click="upload()">提交并进行下一项巡检</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			const currentDate = this.getDate({
			            format: true
			        })
			return {
				XJresult:[{name:'已检查无隐患',id:1},{name: '一般隐患事故',id:2}, {name:'疑似重大隐患',id:3}],
				XJresultIndex:0,
				YHDL:[{name:'基础管理',id:1},{name: '现场管理',id:2}],
				YHDLIndex:0,
				YHXL:[
					{name:'生产设备设施',id:1},{name: '特种设备现场管理',id:2}, {name:'消防与应急安全',id:3},
					{name:'用电安全',id:4},{name: '职业卫生现场管理',id:5}, {name:'危险化学用品',id:6},
					{name:'场所环境',id:7},{name: '从业人员操作行为',id:8}, {name:'有限空间现场管理',id:9},
					{name:'辅助动力系统',id:10},{name: '相关方现场管理',id:11}, {name:'其他现场管理',id:12},
				],
				YHXLIndex:0,
				date:currentDate,
				
				//页面数据
				data:'',
				//数据的总条数
				tol:'',
				//数据当前的索引
				curr:0,
				
				picsarr:[],//图片上传地址
				check_static:'', //状态的id
				content:'', // 内容
				danger_cart:'', // 隐患小id
				pics:'',  //图片
				fx_check_id:"", //数据id
				last_time:currentDate,
				userid:uni.getStorageSync("userid")
			}
		},
		computed: {
			startDate() {
				return this.getDate('start');
			},
			endDate() {
				return this.getDate('end');
			}
		},
		onLoad(e){
			this.data = JSON.parse(e.detil);
			this .fx_check_id = this.data.id
			var toldata =JSON.parse(uni.getStorageSync("xuncha"));
			this.tol =toldata.length;
			this.curr = parseInt(e.index);
			this.getDangerCartBytop();
		},
		methods:{
			//上传图片
			updatafile(){
				var _this = this;
				uni.chooseImage({
					sourceType: ["camera"],
					sizeType: ["compressed"],
					// count: 1,
					success: (res) => {
						// _this.picsarr = res.tempFilePaths;
						res.tempFilePaths.forEach(function(item,index){
							uni.uploadFile({
								url: _this.$API.upload,
								name: 'file',
								filePath: item,
								success: function(resdata) {
									_this.picsarr.push(item);
									resdata.data = JSON.parse(resdata.data);
									_this.pics +=','+resdata.data.fileName;
								},
								fail: function(res) {
									uni.showToast({
										title:"上传失败",
										icon:'none'
									})
									// console.log('上传失败', res);
								}
							});
						})
						
					}
				});
			},
			//提交数据计入缓存
			upload (){
				if(this.data.is_photo==1&&this.check_static!=1&&this.pics==''){
					uni.showToast({
						title:'请上传图片',
						icon:"none"
					})
					return false;
				}
				var result = {
					"check_static":this.check_static,
					"fx_check_id":this.fx_check_id,
					"pics":this.pics,
					"content":this.content,
					"danger_cart":this.danger_cart,
					"last_time":this.last_time + " 00:00:00"
				}
			var toldata =JSON.parse(uni.getStorageSync("xuncha"));
				toldata[this.curr]['result'] = result
				var sty = JSON.stringify(toldata)
				uni.setStorageSync("xuncha",sty);
				uni.navigateBack({
					delta:1
				})
			},
			// 1.2.隐患大类分类
			getDangerCartBytop(){
				// top:获取大类
				var _this = this;
				uni.request({
					url:this.$API.getDangerCartBy,
					method:"POST",
					data:{
						type:'top'
					},
					header:this.$API.get_head(),
					success: (res) => {
						_this.YHDL = res.data.data;
						_this.getDangerCartByunder(res.data.data[0].id)
					}
				})
			},
			// 1.2.隐患大类分类
			getDangerCartByunder(pid){
				// top:获取大类     under:获取小类    all  获取所有
				// type=under&p_id=1
				var _this = this;
				uni.request({
					url:this.$API.getDangerCartBy,
					method:"POST",
					data:{
						type:'under',
						p_id:pid
					},
					header:this.$API.get_head(),
					success: (res) => {
						_this.YHXL = res.data.data;
					}
				})
			},
			XJresultChange(e){
				this.XJresultIndex = e.target.value;
				
				this.check_static =this.XJresult[this.XJresultIndex].id
			},
			YHDLChange(e){
				this.YHDLIndex = e.target.value
				this.getDangerCartByunder(this.YHDL[this.YHDLIndex].id)
			},
			YHXLChange(e){
				this.YHXLIndex = e.target.value
				
				this.danger_cart = this.YHXL[this.YHXLIndex].id
			},
			bindDateChange: function(e) {
				this.date = e.detail.value
				this.last_time = e.detail.value
			},
			getDate(type) {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
	
				if (type === 'start') {
					year = year - 60;
				} else if (type === 'end') {
					year = year + 2;
				}
				month = month > 9 ? month : '0' + month;;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			}
		}
	}
</script>

<style>
	.card{padding:20upx 30upx;margin:0 20upx 20upx 20upx;background:#FFFFFF;border-radius:20upx;}
	.row{display: flex;justify-content:flex-start;}
	.ab{color:#666666;}
	.card_titlte{color: #221815;font-size:36upx;font-weight:700;}
	.card_titlte_sm{color: #221815;font-size:28upx;font-weight:700;}
	.inputbox{margin:0 20upx 20upx 20upx;}
	.inputbox input{background:#FFFFFF;border-radius:10upx;height:30upx;padding:20upx;}
	.nowrap{white-space: nowrap;padding:15upx 0;}
	textarea{width:90%;border:1upx solid #CCCCCC;margin:2%;}
	.textarea{padding:15rpx;}
	.pre_pic{display: flex;justify-content: space-between;padding:15upx;flex-flow: wrap;}
	.pre_pic image{width:150upx;max-width:150upx;min-width:150upx;height:225upx;border-radius:10upx;margin-right:20upx;margin-bottom:10upx;}
	.pre_pic image:nth-child(3n){margin-right:0;}
	.zgr{padding:0upx 15upx;border:1upx solid #CCCCCC;margin: 15upx;border-radius:10upx;}
	.btntj{margin:40upx auto;width:75%;font-size: 30rpx;}
	picker .uni-input{color: #007AFF;}
</style>